<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="base/normalize.css" />
	<link rel="stylesheet" href="css/css.css" />
	<link rel="stylesheet" href="swiper.min.css" />
	<script src="suning.js"></script>
    <title>Document</title>
</head>
<body>
	<div class="index">
		<div class="search-index">
			<img src="./images/tp1.png"/>
			<div >
				<img src="./images/tp2.png"/>
			</div>
			<img src="./images/tp3.png"/>
		</div>
		<div class="seaech">
			<form action="" method="post">
				<input type="text" value="踏青好物低至8.8元" class="seaech-box" />
			</form>
		</div>
	</div>
	
	<div class="focus">
		<a href="#"><img src="images/tp5.png"/></a>
	</div>
	<div class="local">
		<ul>
			<li>
			<span></span>
			<span>苏宁秒杀</span>
			</li>
			<li>
			<span></span>
			<span>苏宁超市</span>	
			</li>
			<li>
			<span></span>
			<span>苏宁拼购</span>	
			</li>
			<li>
			<span></span>
			<span>苏宁数码</span>	
			</li>
			<li>
			<span></span>
			<span>苏宁相机</span>	
			</li>
			<li>
			<span></span>
			<span>免费水果</span>	
			</li>
			<li>
			<span></span>
			<span>super会员</span>	
			</li>
			<li>
			<span></span>
			<span>签到有礼</span>	
			</li>
			<li>
			<span></span>
			<span>领卷中心</span>	
			</li>
			<li>
			<span></span>
			<span>更多频道</span>	
			</li>
		</ul>
	</div>
	<div class="nav">
		<img src="images/hb1.png" alt=""/>
		<img src="images/hb2.gif" alt=""/>
		<img src="images/hb3.gif" alt=""/>
	</div>
	<div class="flexd">
		<a><img src="images/hb.gif"/></a>
	</div>
	<div class="fous">
		<div class="swiper-container">
		    <div class="swiper-wrapper">
		      <div class="swiper-slide">
				  <a href="#"><img src="images/lbt1.jpg"/></a>
				  </div>
		      <div class="swiper-slide">
				  <a href="#"><img src="images/lbt2.png"/></a>
			  </div>
		      <div class="swiper-slide">
				  <a href="#"><img src="images/lbt3.png"/></a>
			  </div>
		      <div class="swiper-slide">
				  <a href="#"><img src="images/lbt4.png"/></a>
			  </div>
		      <div class="swiper-slide">
				  <a href="#"><img src="images/lbt5.jpg"/></a>
			  </div>
		    </div>
		    <!-- Add Pagination -->
		    <div class="swiper-pagination"></div>
		  </div>
		   <div class="swiper-button-next" style="color: #7B807E;border: none; outline: none;"></div>
		    <div class="swiper-button-prev" style="color: #7B807E;border: none; outline: none;"></div>
	</div>
	<div class="subnav-entry">
		<div>
			<div class="subnav">
				<div class="subnav-box1">
					<span>限时秒杀</span>
					<span class="span1"></span>
					<span class="sapn"></span>
					<span class="span"></span>
				</div>
				<div class="subnav-box2">
					人气好货限时抢
				</div>
				<div class="subnav-box3">
					<div class="sub">
						<span><img class="img" src="./upload/sp1.jpg"/></span>
						<span>￥58</span>
					</div>
					<div class="sub">
						<span><img class="img" src="./upload/sp2.jpg"/></span>
						<span>￥9.8</span>
					</div>
				</div>
			</div>
			<div class="subnav">
				<div class="subnav-box1">
					<span>新品首发</span>
				</div>
				<div class="subnav-box2">
					一加9免费试
				</div>
				<div class="subnav-box3">
					<div class="sub">
						<span><img class="img" src="./upload/sp3.webp"/></span>
					</div>
					<div class="sub">
						<span><img class="img" src="./upload/sp4.webp"/></span>
					</div>
				</div>
			</div>
		</div>
		<div>
			<div class="subnav">
				<div class="subnav-box1">
					<span>大聚惠</span>
				</div>
				<div class="subnav-box2">
					聚优品，惠生活
				</div>
				<div class="subnav-box3">
					<div class="sub">
						<span><img class="img" src="./upload/sp5.webp"/></span>
						<span>飞科</span>
					</div>
					<div class="sub">
						<span><img class="img" src="./upload/sp6.webp"/></span>
						<span>维达</span>
					</div>
				</div>
			</div>
			<div class="subnav">
				<div class="subnav-box1">
					<span>苏宁拼购</span>
				</div>
				<div class="subnav-box2">
					2人拼更实惠 全场包邮
				</div>
				<div class="subnav-box3">
					<div class="sub">
						<span><img class="img" src="./upload/sp7.webp"/></span>
						<div class="sjx">2人拼购469</div>
					</div>
					<div class="sub">
						<span><img class="img" src="./upload/sp8.webp"/></span>
						<div class="sjx">2人拼购4.8</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="entry">
		<ul class="entry-ul">
			<li>
				<h6>为您推荐</h6>
				<span class="text1">精选频道</span>
			</li>
			<li>
				<span><img src="./upload/spa1.webp"/></span>
				<span>苏宁国际</span>
			</li>
			<li>
				<span><img src="./upload/spa2.webp"/></span>
				<span>苏宁Out</span>
			</li>
			<li>
				<span><img src="./upload/spa3.png"/></span>
				<span>会员抢购</span>
			</li>
			<li>
				<span><img src="./upload/spa4.png"/></span>
				<span>Supr会员</span>
			</li>
		</ul>
	</div>
	<div class="tjbd">推荐榜单</div>
	<div class="her-td">
		<ul>
		<li>
			<div><img src="upload/sp10.webp"/></div>
			<div>
			<span>时尚保鲜冰箱榜</span>
			<span>爆卖4.4万件</span>
			</div>
			<div>人气榜</div>
		</li>
		<li class="li">
			<ul class="li-ul">
				<li class="li-ul-li">
					<div><img src="./upload/sp14.webp"/></div>
					<div>
					<span>时尚手表榜</span>
					<span>爆卖496件</span>
					</div>
					<div>人气榜</div>
				</li>
				<li class="li-ul-li">
					<div><img src="upload/sp12.webp"/></div>
					<div>
					<span>时尚沐浴露榜</span>
					<span>爆卖2546件</span>
					</div>
					<div >人气榜</div>
				</li>
				<li class="li-ul-li">
					<div><img src="./upload/sp13.webp"/></div>
					<div>
					<span>亲肤柔韧抽纸榜</span>
					<span>爆卖11.8万件</span>
					</div>
					<div>人气榜</div>
				</li>
				<li class="li-ul-li">
					<div><img src="./upload/sp14.webp"/></div>
					<div>
					<span>补水养肤面膜榜</span>
					<span>爆卖8.6万件</span>
					</div>
					<div>人气榜</div>
				</li>
				<li class="li-ul-li">
					<div><img src="upload/sp12.webp"/></div>
					<div>
					<span>时尚沐浴露榜</span>
					<span>爆卖2546件</span>
					</div>
					<div>人气榜</div>
				</li>
			</ul>
		</li>
		<li>
			<div><img src="upload/sp11.webp"/></div>
			<div>
			<span>时尚手表榜</span>
			<span>爆卖496件</span>
			</div>
			<div>人气榜</div>
			  </li>
		</ul>
	</div>
	<div class="foot">
		<div></div>
		<div>
			<span>
				<img src="images/tb1.png" />
				<span>猜你喜欢</span>
			</span>
			<span>
				<img src="images/tb2.png" />
				<span>分类</span>
			</span>
			<span>
				<img src="images/tb3.png" />
				<span>排行榜</span>
			</span>
			<span>
				<img src="images/tb4.png" />
				<span>购物车</span>
			</span>
			<span>
				<img src="images/tb5.png" />
				<span>我的易购</span>
			</span>
		</div>
	</div>
</body>
<script src="swiper.min.js"></script>
 <script>
	 (function(){
		 var swiper = new Swiper('.swiper-container', {
		   slidesPerView: 3,
		   spaceBetween: 30,
		   centeredSlides: true,
		   loop: true,
		    pagination: {
		           el: '.swiper-pagination',
		           type: 'progressbar',
		         },
		         navigation: {
		           nextEl: '.swiper-button-next',
		           prevEl: '.swiper-button-prev',
		         },
		 });
	 }());
	 
	
	 var div=document.querySelector('.subnav-box1');
	 var span=div.children;
	 console.log(span);
	 var nt=new Date('2021-4-1 23:45:0');
	 niubi();
	 function niubi(){
	 	var time=new Date();
	 	if(nt>time){
	 	var sum=nt-time;
	 	var h= parseInt(sum/1000/60/60%24);
	 	var m=parseInt(sum/1000/60%60);
	 	var s=parseInt(sum/1000%60);
	 	h=h<10?'0'+h:h;
	 	m=m<10?'0'+m:m;
	 	s=s<10?'0'+s:s;
	 	span[1].innerHTML=h;
	 	span[2].innerHTML=m;
	 	span[3].innerHTML=s;
	 	}
	 }
	 setInterval(niubi,1000);
	 function getDropDown(obj,target,callback){
	 		clearInterval(obj.timer);
	 		obj.timer=setInterval(function(){
	 			var step=(target-obj.offsetLeft)/10;
	 			step=step>0?Math.ceil(step):Math.floor(step);
	 			if(obj.offsetLeft==target){
	 				clearInterval(obj.timer);
	 			// 	if(callback){
	 			// 		callback();
	 			// 	}
	 			callback&&callback();
	 			 }
	 			else{
	 				obj.style.left=obj.offsetLeft+step+'px';
	 			}
	 		},15);
	 	}
  </script>
</html>